<template>
	<z-container title="检测报告">
		<view class="ss-p-x-32 ss-p-y-24 bg-white ss-flex-col gap-24">
			<TestTitleContent label="前轮">
				<ExamineItem label="前束" :allNumber="(Number(form.q_szuo) + Number(form.q_syou)).toFixed(2)">
					<ItemInput label="左" v-model="form.q_szuo" />
					<ItemInput label="右" v-model="form.q_syou" />
				</ExamineItem>
				<ExamineItem label="外倾角">
					<ItemInput label="左" v-model="form.q_wzuo" />
					<ItemInput label="右" v-model="form.q_wyou" />
				</ExamineItem>
				<ExamineItem label="后倾">
					<ItemInput label="左" v-model="form.q_hzuo" />
					<ItemInput label="右" v-model="form.q_hyou" />
				</ExamineItem>
				<ExamineItem label="内倾">
					<ItemInput label="左" v-model="form.q_nzuo" />
					<ItemInput label="右" v-model="form.q_nyou" />
				</ExamineItem>
				<ExamineItem label="包容角">
					<ItemInput label="左" v-model="form.q_bzuo" />
					<ItemInput label="右" v-model="form.q_byou" />
				</ExamineItem>
				<ExamineItem label="退缩角">
					<ItemInput label="总" v-model="form.q_tusjiao" />
				</ExamineItem>
			</TestTitleContent>
		</view>
		<view class="ss-p-x-32 ss-p-y-24 bg-white ss-flex-col gap-24 ss-m-t-24">
			<TestTitleContent label="后轮">
				<ExamineItem label="前束" :allNumber="(Number(form.h_szuo) + Number(form.h_syou)).toFixed(2)">
					<ItemInput label="左" v-model="form.h_szuo" />
					<ItemInput label="右" v-model="form.h_syou" />
				</ExamineItem>
				<ExamineItem label="外倾角">
					<ItemInput label="左" v-model="form.h_wzuo" />
					<ItemInput label="右" v-model="form.h_wyou" />
				</ExamineItem>
				<ExamineItem label="推力角">
					<ItemInput label="总" v-model="form.h_tlijiao" />
				</ExamineItem>
			</TestTitleContent>
		</view>
		<!-- <view class="ss-p-x-32 ss-p-y-24 bg-white ss-flex-col gap-24 ss-m-t-24">
			<TestTitleContent label="轮距">
				<ExamineItem>
					<ItemInput label="前" v-model="form.lj_qian" />
					<ItemInput label="后" v-model="form.lj_hou" />
				</ExamineItem>
			</TestTitleContent>
		</view>
		<view class="ss-p-x-32 ss-p-y-24 bg-white ss-flex-col gap-24 ss-m-t-24">
			<TestTitleContent label="轴距">
				<ExamineItem>
					<ItemInput label="左" v-model="form.zj_zuo" />
					<ItemInput label="右" v-model="form.zj_you" />
				</ExamineItem>
			</TestTitleContent>
		</view> -->
		<view class="ss-p-x-32 ss-p-y-24 bg-white ss-flex-col gap-24 ss-m-t-24">
			<TestTitleContent label="建议项目">
				<view class="ss-flex-col gap-24">
					<view @tap="changeJYcheck(item)" v-for="(item,index) in jyproject" :key="index" class="ss-flex gap-24">
						<z-icon :name="form.jy_ids.split(',').includes(item.id.toString())?'checked':'check'" size="32rpx"></z-icon>
						<view class="fc-dark6 fs-28">{{ item.name }}</view>
					</view>
				</view>
			</TestTitleContent>
		</view>
		<view class="ss-p-x-32 ss-p-y-24 bg-white ss-flex-col gap-24 ss-m-t-24">
			<TestTitleContent label="增值服务">
				 <ReplaceXInputs v-model="selectedList" :options="zzproject" @change="onChange" />
				<!-- <view class="ss-flex-col gap-24">
					<view class="ss-flex gap-24">
						<z-icon name="checked" size="32rpx"></z-icon>
						<view class="fc-dark6 fs-28">建议做基础四轮定位</view>
					</view>
					<view class="ss-flex gap-24">
						<z-icon name="check" size="32rpx"></z-icon>
						<view class="fc-dark6 fs-28">建议底盘悬挂各个零件检查</view>
					</view>
					<view class="ss-flex gap-24">
						<z-icon name="check" size="32rpx"></z-icon>
						<view class="fc-dark6 fs-28 ss-flex gap-12">
							<text>建议更换减震器</text>
							<input type="text" placeholder="（请输入）" class="wb-20 fs-28" placeholder-class="fc-c5" />
							<text>支</text>
						</view>
					</view>
					<view class="ss-flex gap-24">
						<z-icon name="check" size="32rpx"></z-icon>
						<view class="fc-dark6 fs-28 ss-flex gap-12">
							<text>建议更换轮胎</text>
							<input type="text" placeholder="（请输入）" class="wb-20 fs-28" placeholder-class="fc-c5" />
							<text>条</text>
						</view>
					</view>
				</view> -->
			</TestTitleContent>
		</view>
		<uv-gap height="50"></uv-gap>
		<z-bottom>
			<view class="ss-p-x-32 ss-p-y-16">
				<z-button @tap="svaeSubmit">保存</z-button>
			</view>
		</z-bottom>
	</z-container>
</template>

<script setup>
	import sheep from "@/sheep"
	import TestTitleContent from "@/pages/components/TestTitleContent"
	import ExamineItem from "@/pages/components/ExamineItem"
	import ItemInput from "@/pages/components/ItemInput"
	import ReplaceXInputs from "@/pages/components/ReplaceXInputs"
import { jsonString } from "@climblee/uv-ui/libs/function/test"
	const state = reactive({
		
	})
	/**
	 * 回显示把数据格式弄成这样的
	 */
	// { id: 1, inputValues: ['10', '20'], inputValue: '10,20' },
	//   { id: 3, inputValues: ['30', '40', '50'], inputValue: '30,40,50' }
	const selectedList = ref([])
	const jyproject = computed(() => sheep.$store('app').jyproject)
	const zzproject = computed(() => sheep.$store('app').zzproject)
	const options = [
		{
			id:1,
			name:'增值服务'
		},
		{
			id:2,
			name:'增值服务x个,其他服务x条'
		}
	]
	const form = reactive({
		q_szuo:'',  //前轮-束左
		q_syou:'',	//前轮-束右	
		q_wzuo:'',	//前轮-外倾角左
		q_wyou:'',	//前轮-外倾角右
		q_hzuo:'',	//前轮-后倾左
		q_hyou:'',	//前轮-后倾右
		q_nzuo:'',	//前轮-内倾左
		q_nyou:'',	//前轮-内倾右
		q_bzuo:'',  //前轮-包容角左
		q_byou:'',	//前轮-包容角右
		q_tusjiao:'',	//前轮-退缩角	
		
		h_szuo:'',	//后轮-前束左
		h_syou:'',	//后轮-前束右
		h_wzuo:'',	//后轮-外倾角左
		h_wyou:'',	//后轮-外倾角右
		h_tlijiao:'',	//后轮-推力角
		
		lj_qian:'',	//轮距-左
		lj_hou:'',	//轮距-右
		
		zj_zuo:'',	//轴距-左
		zj_you:'',	//轴距-右
		
		jy_ids:'',  //建议项目ids
		zzhi_projects:[]  //增值项目	
	})
	onLoad(({order_id = ''}) => {
		if(order_id) form.order_id = order_id
		console.log(form);
	})
	function changeJYcheck({id}){
		let jy_ids_arr = form.jy_ids?form.jy_ids.split(','):[]
		id = id.toString()
		if(jy_ids_arr.includes(id)){
			jy_ids_arr = jy_ids_arr.filter(item => item != id)
		}else{
			jy_ids_arr.push(id)
		}
		form.jy_ids = jy_ids_arr.join(',')
	}
	function onChange(values) {
	  let zzhi_projects_arr = []
	  selectedList.value.map(item => {
		  zzhi_projects_arr.push({
			  zzhi_id:item.id,
			  zzhi_value:item.inputValue
		  })
	  })
	  form.zzhi_projects = zzhi_projects_arr
	  // console.log(form.zzhi_projects);
	}
	async function svaeSubmit(){
		let formData = JSON.parse(JSON.stringify(form))
		formData.zzhi_projects = JSON.stringify(formData.zzhi_projects)
		const { code,data } = await sheep.$api.user.jcpreport_save(formData)
		if(code != 1) return
		setTimeout(() => {
			if(form.order_id) {
				uni.$emit('onReachOrder')
				uni.$emit('onReachIndex')
			}else {
				uni.$emit('get_jiance_id',data.jc_id)
			}
			uni.navigateBack()
		},1000)
	}
</script>

<style>

</style>
